<template>
  <div class="all">
    <div class="top">
      <header>
<!--        检查数据的返回-->
        <div class="div header_left" v-show="isImgShow === false" @click="back">
          <img src="../../../assets/返回.png" alt="">
          <span class="solt">返回</span>
        </div>
<!--         上传图片的返回-->
        <div class="div header_left" v-show="isImgShow === true"
             @click="isImgShow = false, clickTabs(tabIndex)">
          <img src="../../../assets/返回.png" alt="">
          <span class="solt">返回</span>
        </div>
        <div class="div header_cont" v-show="isImgShow === false">
          <span v-if="haveJianCha === false && Number(isEdit) === 1">检查数据修改</span>
          <span v-else-if="haveJianCha === false" >检查数据新增</span>
          <span v-else-if="Number(isEdit) === 0 || haveJianCha === true" >检查数据查看</span>
        </div>
        <div class="div header_cont" v-show="isImgShow === true">
          <span v-if="haveJianCha === false" >上传检查报告照片</span>
          <span v-else-if="haveJianCha === true" >检查报告照片</span>
        </div>
        <div class="div header_right" v-show="isImgShow === false" >
          <button v-if="tabIndex === 0" style="background: none;border: none" class="solt" @click="clickTabs(1)">下一步</button>
          <button v-if="haveJianCha === false && tabIndex === 1" @click="keep()" style="background: none;border: none" class="solt"  >保存</button>
        </div>
        <div class="div header_right" v-show="isImgShow === true" @click="keepImg()">
          <button  style="background: none;border: none" class="solt"  v-if="haveJianCha === false">保存</button>
        </div>
      </header>
      <div class="tabs" v-show="isImgShow === false">
        <ul>
          <li :class="[tabIndex === 0 ? 'select' : '']">
            <img src="../../../assets/检查检验基本信息.png" alt="" @click="clickTabs(0)">
            <img v-show="tabIndex === 0" src="../../../assets/检查结果信息未.png" alt="" @click="clickTabs(1)">
            <img v-show="tabIndex === 1" src="../../../assets/检查结果信息.png" alt="" @click="clickTabs(1)">

            <!--            <span v-if="isJianCha === 'true'">检查基本信息</span>-->
          </li>
<!--          <li :class="[tabIndex === 1 ? 'select' : '']" @click="clickTabs(1)">-->
<!--            &lt;!&ndash;            <span v-if="isJianCha === 'true'">检查结果信息</span>&ndash;&gt;-->
<!--          </li>-->
        </ul>
      </div>
      <div class="title" v-show="isImgShow == false"  @click="$toast('正在开发中，敬请期待...')" style="margin: 8px auto;display: flex;justify-content: flex-end">
        <button class="duquBtn">
          <img src="../../../assets/读取医院数据@2x.png" alt="">
          读取医院数据
        </button>
      </div>
    </div>
<!--    <div class="jian_content" v-show="isImgShow == false">-->
<!--    </div>-->
      <!--     检查内容-->
    <div class="content" v-if="(isJianCha == 'true'  || isJianCha== true) && isImgShow == false">
        <div class="tab1" v-show="(isJianCha == 'true'  || isJianCha== true) && tabIndex === 0">
          <ul>
            <li v-if="morz == 0" @click="[haveJianCha === false ? isPickLeibie = true : isPickLeibie = false]">
              <div>* 检查类别</div>
              <div >
                <input class="tabInput" readonly v-model="jianchaleibieName"  type="text"
                       placeholder="请选择检查类别" >
                <img class="tan" v-show="haveJianCha === false && isPickLeibie === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && isPickLeibie === true" src="../../../assets/上弹灰@2x.png" alt="">
              </div>
            </li>
            <li v-else>
              <div>* 检查类别</div>
              <div >
                <span v-show="Number(morz) === 1">门诊</span>
                <span v-show="Number(morz) === 2">住院</span>
              </div>
            </li>
<!--            <li @click="[haveJianCha === false ? isPickLeibie = true : isPickLeibie = false]">-->
<!--              <div>* 项目类别</div>-->
<!--              <div>-->
<!--                <input class="tabInput" readonly v-model="jianchaleibieName"  type="text"-->
<!--                       placeholder="请选择检查类别" >-->
<!--                <img class="tan" v-show="haveJianCha === false && isPickLeibie === false" src="../../assets/下弹灰@2x.png" alt="">-->
<!--                <img class="tan" v-show="haveJianCha === false && isPickLeibie === true" src="../../assets/上弹灰@2x.png" alt="">-->
<!--              </div>-->
<!--            </li>-->
            <li>
              <div>病历号码</div>
              <div>
                <input class="tabInput" :readonly="haveJianCha" v-model="binglihaoma" type="text" placeholder="请输入病历号码" >
              </div>
            </li>
            <li>
              <div>检查编码</div>
              <div>
                <input class="tabInput" :readonly="haveJianCha" v-model="bianma" type="text" placeholder="请输入检查编码" >
              </div>
            </li>
            <li>
              <div>* 姓名</div>
              <div>
                <input class="tabInput" readonly v-model="name" type="text" placeholder="请输入姓名" >
              </div>
            </li>
            <li>
              <div>* 性别</div>
              <div>
                <input readonly class="tabInput"  v-model="sex" type="text" placeholder="请选择性别" >
<!--                <img class="tan" src="../../assets/下弹灰@2x.png" alt="">-->
                <!--              <img class="tan" src="../../assets/上弹灰@2x.png" alt="">-->
              </div>
            </li>
            <li>
              <div>* 年龄</div>
              <div>
                <input class="tabInput" readonly v-model="age" realonly type="text" placeholder="请输入年龄" >
                <span class="ageUnit">岁</span>
              </div>
            </li>
            <li @click="[haveJianCha === false ? isSongJianShow = true : isSongJianShow = false]">
              <div>* 送检日期</div>
              <div>
                <input class="tabInput"
                       readonly
                       v-model="songjiantime"
                       realonly type="text"
                       placeholder="请输入送检日期" >
                <img class="tan" v-show="haveJianCha === false && isSongJianShow === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && isSongJianShow === true" src="../../../assets/上弹灰@2x.png" alt="">
              </div>
            </li>
            <li @click="[haveJianCha === false ? CxiangmuShow = true : CxiangmuShow = false]">
              <div>* 检查项目</div>
              <div>
<!--                -->
                <input  v-model="xiangmu" readonly class="tabInput" type="text" placeholder="请输入检查项目" >
                <img class="tan" src="../../../assets/下弹灰@2x.png" alt="">
<!--                <img class="tan" src="../../assets/上弹灰@2x.png" alt="">-->
              </div>
            </li>
            <li>
              <div>* 检查金额</div>
              <div>
                <input class="tabInput" :readonly="haveJianCha" v-model="money" type="num" placeholder="请输入检查金额" >
                元
              </div>
            </li>
            <li @click="[haveJianCha === false ? jigoushow = true : jigoushow = false]">
              <div>* 检查机构</div>
              <div>
                <input  v-model="jigou" readonly class="tabInput" type="text" placeholder="请选择检查机构" >
                <img class="tan" v-show="haveJianCha === false && jigoushow === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && jigoushow === true" src="../../../assets/上弹灰@2x.png" alt="">
            </div>
            </li>
            <li @click="[haveJianCha === false ? keShishow = true : keShishow = false]">
              <div>* 送检科室</div>
              <div>
                <input  v-model="keshi"
                        readonly
                        class="tabInput"
                        type="text"
                        placeholder="请选择送检科室" >
                <img class="tan" v-show="haveJianCha === false && keShishow === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && keShishow === true" src="../../../assets/上弹灰@2x.png" alt="">
              </div>
            </li>
            <li @click="[haveJianCha === false ? zhenduanshow = true : zhenduanshow = false]">
              <div>* 临床诊断</div>
              <div>
                <input class="tabInput" readonly v-model="linchuangzhenduan" type="text" placeholder="请选择临床诊断" >
                <img class="tan" v-show="haveJianCha === false && zhenduanshow === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && zhenduanshow === true" src="../../../assets/上弹灰@2x.png" alt="">
              </div>
            </li>
            <li>
              <div>* 报告人员</div>
              <div>
                <input class="tabInput" :readonly="haveJianCha" v-model="baogaorenyuan" type="text" placeholder="请输入报告人员" >
              </div>
            </li>
            <li @click="[haveJianCha === false ? isDateShow = true : isDateShow = false]">
              <div>* 报告日期</div>
              <div>
                <input  v-model="riqi" readonly class="tabInput" type="text" placeholder="请选择报告日期" >
                <img class="tan" v-show="haveJianCha === false && isDateShow === false" src="../../../assets/下弹灰@2x.png" alt="">
                <img class="tan" v-show="haveJianCha === false && isDateShow === true" src="../../../assets/上弹灰@2x.png" alt="">
              </div>
            </li>
          </ul>
          <p style="color: red;font-size: 13px;height: 44px;display: flex;align-items: center;margin: 0px 15px"> * 内容为必填项</p>
        </div>
        <div class="tab2" v-show="isJianCha === 'true' && tabIndex === 1">
          <div class="title">
            <a class="hengGang"></a>
            <span>影像表现</span>
          </div>
          <div class="yinXiang">
            <textarea placeholder="请输入影像表现" :readonly="haveJianCha" v-model="biaoxian"></textarea>
          </div>
          <div class="title">
            <a class="hengGang"></a>
            <span>影像判断</span>
          </div>
          <div class="yinXiang">
            <textarea placeholder="请输入影像判断" :readonly="haveJianCha" v-model="panduan"></textarea>
          </div>
        </div>
      </div>
    <div v-show="isImgShow == false" class="bottom">
<!--        v-show="haveJianCha === false || (haveJianCha === true && fileList.length > 0)"-->
      <button @click="addImg()">
        <img src="../../../assets/照片@2x.png" alt="">
        <span v-if="haveJianCha === false && fileList.length <= 0">上传检查报告照片</span>
        <span v-else>查看检查报告照片</span>
      </button>
    </div>
    <van-popup  v-model="isPickLeibie" position="bottom">
     <van-picker
      show-toolbar
      :columns="columns1"
      @confirm="onConfirmLeibie"
      @cancel="isPickLeibie = false"
    >
      <template #title>
        <span >选择检验类别</span>
      </template>
    </van-picker>
    </van-popup>
    <van-popup round v-model="isDateShow" position="bottom">
      <van-datetime-picker
        v-model="currentDate"
        type="datetime"
        :min-date="minDate"
        :max-date="maxDate"
        :formatter="formatter"
        @confirm="Onconfirm()"
        @cancel="isDateShow = false"
        title="选择报告日期"
      />
    </van-popup>
    <van-popup round v-model="isSongJianShow" position="bottom">
      <van-datetime-picker
        v-model="SongJianDate"
        type="datetime"
        :min-date="minDate"
        :max-date="maxDate"
        :formatter="formatter"
        @confirm="SongJianconfirm()"
        @cancel="isSongJianShow = false"
        title="选择送检日期"
      />
    </van-popup>
    <van-popup v-model="keShishow" round position="bottom">
      <van-picker
        title="请选择科室"
        show-toolbar
        :columns="keshiColumns"
        @cancel="keShishow = false"
        @confirm="keShionConfirm"
      >
        <template #columns-top>
          <div class="search">
            <form action="/">
              <van-search
                v-model="keshiValue"
                show-action
                placeholder="请输入科室"
                @keyup.enter="keshionSearch"
                @search="keshionSearch"
                @input="keshionSearch"
                shape="round"
              >
                <template #action>
<!--                  <div @click="keshionSearch" class="solt">搜索</div>-->
                </template>
              </van-search>
            </form>
          </div>
        </template>
      </van-picker>
    </van-popup>

    <van-popup v-model="jigoushow"
    round position="bottom">
      <van-area v-show="cityshow === true"
                item-height="15vw"
                :columns-num="2"
                title="请选择城市"
                @cancel="cityshow = false"
                @confirm="onAreaConfirm"
                :area-list="areaList" />
      <van-picker
        show-toolbar
        title="请选择检查机构"
        :columns="jigouColumns"
        @cancel="jigoushow = false"
        @confirm="jigouonConfirm"
        v-show="cityshow === false"
      >
        <template #columns-top>
          <div class="search">
            <form action="/">
              <van-search
                v-model="jigouValue"
                placeholder="请输入机构"
                @keyup.enter="jigouonSearch"
                @input="jigouonSearch"
                @search="jigouonSearch"
                shape="round"
              >
                <template #left-icon>
                  <div style="height: 100%;border-right:1px solid #E5E5E5;display: flex;align-items: center">
                    <img src="../../../assets/地址蓝.png" style="width: 12px;height: 13px;margin-right: 5px" alt="">
                    <input type="text"
                         class="cityInput"
                         @click="cityshow = true"
                         placeholder="选择城市"
                         v-model="city"
                         readonly
                         style="width: 70px;border: none;background: none;color: #1DA4F2">
                  </div>
                </template>
              </van-search>
            </form>
          </div>
        </template>
      </van-picker>
    </van-popup>
    <van-popup v-model="zhenduanshow" round position="bottom">
      <van-picker
        title="请选择诊断"
        show-toolbar
        :columns="zhenduanColumns"
        @cancel="zhenduanshow = false"
        @confirm="zhenduanConfirm"
      >
        <template #columns-top>
          <div class="search">
            <form action="/">
              <van-search
                v-model="zhenduanValue"
                show-action
                placeholder="请输入诊断"
                @input="zhenduanSearch"
                @keyup.enter="zhenduanSearch"
                @search="zhenduanSearch"
                shape="round"
              >
                <template #action>
<!--                  <div @click="zhenduanSearch" class="solt">搜索</div>-->
                </template>
              </van-search>
            </form>
          </div>
        </template>
      </van-picker>
    </van-popup>
    <van-popup v-model="cityshow"
               round position="bottom">
      <van-area item-height="15vw" :columns-num="2" @cancel="cityshow = false" @confirm="onAreaConfirm" title="请选择城市" :area-list="areaList" />
    </van-popup>

    <van-popup v-model="CxiangmuShow" round position="bottom">
      <van-picker
        title="请选择检查项目"
        show-toolbar
        :columns="CxiangmuColumns"
        @cancel="CxiangmuShow = false"
        @confirm="CxiangmuConfirm"
      >
        <template #columns-top>
          <div class="search">
            <form action="/">
              <van-search
                v-model="CxiangmuValue"
                show-action
                placeholder="请输入检查项目"
                @search="CxiangmuSearch"
                @keyup.enter="CxiangmuSearch"
                @input="CxiangmuSearch"
                shape="round"
              >
                <template #action>
                  <!--                  <div @click="xiangmuSearch" class="solt">搜索</div>-->
                </template>
              </van-search>
            </form>
          </div>
        </template>
      </van-picker>
    </van-popup>
    <div class="img_content" v-show="isImgShow === true">
      <div class="imgList">
        <van-uploader v-if="haveJianCha === false"
                      v-model="fileList"
                      multiple="true"
                      @delete="Delete"
                      :before-delete="beforeDel"
                      image-fit="cover"
                      accept="image/*"
                      preview-size="28.5vw"
                      :after-read="updateFile"
                      :upload-icon="require('../../../assets/上传图片.png')"
        >
        </van-uploader>
        <van-uploader v-else-if="haveJianCha === true"
                      v-model="fileList"
                      upload-icon="plus"
                      :deletable="false"
                      :max-count="imgList.length"
                      multiple="true"
                      @delete="Delete"
                      :before-delete="beforeDel"
                      image-fit="cover"
                      accept="image/*"
                      preview-size="28.5vw"
                      :after-read="updateFile"
        />
      </div>
    </div>
  </div>
</template>

<script>
import $ from 'jquery'
import {Toast} from 'vant'
import lrz from 'lrz'
import area from '../../../components/China/area'
export default {
  name: 'BuildCheckData',
  data () {
    return {
      cityshow: false,
      areaList: area,
      city: '',
      isJianCha: String(this.$route.query.isJianCha),
      tabIndex: 0,
      isImgShow: false,
      isDateShow: false,
      haveJianCha: false,
      isSongJianShow: false,
      fileList: [],
      imgList: [],
      // 检查类别
      jianchaleibie: '',
      jianchaleibieName: '',
      // 病历号码
      binglihaoma: '',
      // 操作人id
      op_user_id: '',
      // 档案人id
      data_user_id: '',
      // 检查编码
      bianma: '',
      // 送检日期
      songjiantime: '',
      // 检查项目
      xiangmu: '',
      // 检验机构
      jigou: '',
      // 送检科室
      keshi: '',
      // 临床诊断
      linchuangzhenduan: '',
      // 报告人员
      baogaorenyuan: '',
      // 报告日期
      riqi: '',
      // 影像表现
      biaoxian: '',
      // 影像判断
      panduan: '',
      name: '',
      sex: '',
      age: '',
      columns: ['CT', 'B超'],
      columns1: ['住院', '门诊'],
      isPickLeibie: false,
      minDate: new Date(2000, 0, 1),
      maxDate: new Date(2025, 10, 1),
      currentDate: new Date(),
      id: this.$route.query.id,
      isSend: false,
      SongJianDate: new Date(),
      keShishow: false,
      keshiColumns: [],
      keshiValue: '',
      jigoushow: false,
      jigouColumns: [],
      jigouValue: '',
      zhenduanshow: false,
      zhenduanColumns: [],
      zhenduanValue: '',
      morz: this.$route.query.morz,
      CxiangmuShow: false,
      CxiangmuValue: '',
      CxiangmuColumns: [],
      money: '',
      isEdit: Number(this.$route.query.isEdit),
      chushengriqi: ''
    }
  },
  mounted () {
    // $('.all').css('height', $(window).height() - 50 + 'px')
    // 操作人id
    this.op_user_id = this.$route.query.op_user_id
    // 档案人id
    this.data_user_id = this.$route.query.data_user_id
    // $('.content').css('height', $(window).height() - $('.top').height() - $('.bottom').height() - 50 + 'px')
    // 定位
    this.city = sessionStorage.getItem('LocationCity')
    if (this.city === '定位中') {
      this.city = ''
    }
    // 获取个人基本信息 如姓名 性别
    this.getFindUserXinXi()
    //  检查的接口
    if (this.id !== undefined && this.id !== null && this.id !== '') {
      this.getfindOneCheck()
    } else {
      this.id = null
    }
    //  获取科室
    this.getfindKeShiZiDian()
    //  查看机构字典表
    this.getfindHopZiDian()
    // 门诊诊断
    this.getZhenduan()
    // 检查项目字典
    this.getfindXiangMuZiDian()

    // if (Number(res.data.data.hour) === 0) {
    // } else if (Number(res.data.data.hour) === 1) {
    // }
  },
  methods: {
    // 检查项目确认按钮
    CxiangmuConfirm (value) {
      this.xiangmu = value
      this.CxiangmuShow = false
    },
    CxiangmuSearch () {
      this.getfindXiangMuZiDian()
    },
    // 检查项目字典
    getfindXiangMuZiDian () {
      this.$http.findjianchaZiDian({name: this.CxiangmuValue})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            var _this = this
            // // 检查
            this.CxiangmuColumns = []
            res.data.data.forEach(function (current, index, arr) {
              _this.CxiangmuColumns.push(current.check_name)
            })
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 地址
    onAreaConfirm (val) {
      this.city = val[1].name
      //  查看机构字典表
      this.getfindHopZiDian()
      this.cityshow = false
      this.jigoushow = true
    },
    // 诊断确定按钮
    zhenduanConfirm (value, index) {
      this.linchuangzhenduan = value
      this.zhenduanshow = false
    },
    // 诊断搜索
    zhenduanSearch () {
      this.getZhenduan()
    },
    // 获取诊断
    getZhenduan () {
      this.$http.getDiagnoseList({key: this.zhenduanValue})
        .then(res => {
          console.log(res)
          this.zhenduanColumns = []
          if (res.data.status === 'success') {
            for (var i = 0; i < res.data.data.length; i++) {
              this.zhenduanColumns.push(res.data.data[i].name)
            }
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 机构确定按钮
    jigouonConfirm (val, index) {
      this.jigou = val
      this.jigoushow = false
    },
    // 机构搜索
    jigouonSearch () {
      this.getfindHopZiDian()
    },
    // 机构字典
    getfindHopZiDian () {
      this.$http.findHopZiDian({city: this.city, name: this.jigouValue})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            var _this = this
            _this.jigouColumns = []
            res.data.data.forEach(function (current, index, arr) {
              _this.jigouColumns.push(current.hopstial_name)
            })
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 科室搜索
    keshionSearch () {
      //  获取科室
      this.getfindKeShiZiDian()
    },
    // 选择科室的确定按钮
    keShionConfirm (value, index) {
      this.keshi = value
      this.keShishow = false
    },
    // 获取科室
    getfindKeShiZiDian () {
      this.$http.findKeShiZiDian({name: this.keshiValue})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.keshiColumns = []
            var _this = this
            res.data.data.forEach(function (current, index, arr) {
              _this.keshiColumns.push(current.name)
            })
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 送检日期选择 确定
    SongJianconfirm (value, index) {
      this.songjiantime = this.wanzhengDate(new Date(this.SongJianDate))
      this.age = new Date(this.songjiantime).getFullYear() - new Date(this.chushengriqi).getFullYear()
      this.isSongJianShow = false
    },
    // 检查详情
    getfindOneCheck () {
      this.$http.findOneCheck({id: this.id})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            var _this = this
            if (Number(res.data.data.hour) === 0) {
              this.haveJianCha = true // 不可编辑
            } else if (Number(res.data.data.hour) === 1) {
              this.haveJianCha = false // 可编辑
            }
            if (this.isEdit === 0) {
              this.haveJianCha = true // 不可编辑
            } else if (this.isEdit === 1) {
              this.haveJianCha = false // 可编辑
            }
            this.morz = res.data.data.morz
            this.baogaorenyuan = res.data.data.baogaorenyuan
            this.bianma = res.data.data.bianma
            this.biaoxian = res.data.data.biaoxian
            this.binglihaoma = res.data.data.binglihaoma
            this.id = res.data.data.id
            this.img = res.data.data.img
            res.data.data.img.forEach(function (current, index, arr) {
              var obj = {
                url: current.picture,
                isImage: true
              }
              _this.fileList.push(obj)
              _this.imgList.push(current.picture)
            })
            this.jianchaleibie = res.data.data.jianchaleibie
            if (Number(res.data.data.jianchaleibie) === 1) {
              this.onConfirmLeibie('CT', res.data.data.jianchaleibie - 1)
            } else if (Number(res.data.data.jianchaleibie) === 2) {
              this.onConfirmLeibie('B超', res.data.data.jianchaleibie - 1)
            }
            this.jigou = res.data.data.jigou
            this.keshi = res.data.data.keshi
            this.linchuangzhenduan = res.data.data.linchuangzhenduan
            this.panduan = res.data.data.panduan
            this.riqi = res.data.data.riqi
            this.xiangmu = res.data.data.xiangmu
            this.songjiantime = res.data.data.songjiantime
            this.isSend = true
            this.money = res.data.data.money

            this.age = Number(new Date(this.songjiantime).getFullYear()) - Number(new Date(this.chushengriqi).getFullYear())
            console.log(this.age)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 日期确定按钮
    Onconfirm (value, index) {
      this.riqi = this.wanzhengDate(new Date(this.currentDate))
      this.isDateShow = false
    },
    // 转换时间
    formatDate (date) {
      var YY = date.getFullYear()
      var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1)
      var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate())
      return YY + '-' + MM + '-' + DD
    },
    // 完整时间转换
    wanzhengDate (date) {
      var YY = date.getFullYear()
      var MM = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1)
      var DD = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate())
      var hh = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'
      var mm = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':'
      var ss = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds())

      return YY + '-' + MM + '-' + DD + ' ' + hh + mm + ss
    },
    formatter (type, val) {
      if (type === 'year') {
        return `${val}年`
      } else if (type === 'month') {
        return `${val}月`
      } else if (type === 'day') {
        return `${val}日`
      }
      return val
    },
    // 获取这个人的基本信息
    getFindUserXinXi () {
      this.$http.findUserXinXiTuoMin({data_user_id: this.data_user_id})
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            this.name = res.data.data.name
            if (Number(res.data.data.SEX) === 1) {
              this.sex = '男'
            } else if (Number(res.data.data.SEX) === 2) {
              this.sex = '女'
            }
            this.age = res.data.data.age
            this.chushengriqi = res.data.data.chushengriqi
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 点击类别
    clickLeibie () {
    },
    // 点击日期
    clickRiqi () {
    },
    // 类别确认按钮
    onConfirmLeibie (value, index) {
      // if (this.isJianCha === 'true') {
      this.jianchaleibieName = value
      this.jianchaleibie = index + 1
      this.morz = index + 1
      // } else {}
      // console.log(value)
      this.isPickLeibie = false
    },
    beforeDel (detail) {
      if (this.isSend === true) {
        return true
      } else {
        Toast('请压缩完之后再进行操作')
        return false
      }
    },
    // 删除图片
    Delete (file, detail) {
      this.imgList.splice(detail.index, 1)
    },
    // 上传图片
    updateFile (file) {
      this.checkfileUpload(file, 0)
    },
    // 上传图片请求操作
    checkfileUpload (file, i) {
      if (file.length === undefined) {
        this.isSend = false
        file.status = 'uploading'
        file.message = '正在压缩中...'
        if (file.file !== undefined) {
          lrz(file.file, {
            width: 2000,
            quality: 0.7 // 图片压缩质量，取值0-1，默认为0.7
          })
            .then((rst) => {
              this.$http.checkfileUpload({base64: rst.base64})
                .then(res => {
                  console.log(res)
                  if (res.data.status === 'success') {
                    this.imgList.push(res.data.sign_url)
                    this.isSend = true
                    file.status = ''
                    file.message = ''
                  }
                })
                .catch(err => {
                  console.log(err)
                })
            })
            .catch((error) => {
              console.log('失败', error)
              // 失败时执行
            })
        } else {
          lrz(file, {
            width: 2000,
            quality: 0.7 // 图片压缩质量，取值0-1，默认为0.7
          })
            .then((rst) => {
              this.$http.checkfileUpload({base64: rst.base64})
                .then(res => {
                  console.log(res)
                  if (res.data.status === 'success') {
                    this.imgList.push(res.data.sign_url)
                    this.isSend = true
                    file.status = ''
                    file.message = ''
                  }
                })
                .catch(err => {
                  console.log(err)
                })
            })
            .catch((error) => {
              console.log('失败', error)
              // 失败时执行
            })
        }
      } else {
        if (i === file.length) { //  || this.fileList.length > 8
          this.isSend = true
          return false
        }
        this.isSend = false
        if (i === 0) {
          for (var j = 0; j < file.length; j++) {
            file[j].status = 'uploading'
            file[j].message = '正在压缩中...'
          }
        }
        lrz(file[i].file, {
          width: 2000,
          quality: 0.7 // 图片压缩质量，取值0-1，默认为0.7
        })
          .then((rst) => {
            this.$http.checkfileUpload({base64: rst.base64})
              .then(res => {
                console.log(res)
                if (res.data.status === 'success') {
                  this.imgList.push(res.data.sign_url)
                  file[i].status = ''
                  file[i].message = ''
                  i++
                  this.checkfileUpload(file, i)
                }
              })
              .catch(err => {
                console.log(err)
              })
          })
          .catch((error) => {
            console.log('失败', error)
          })
      }
    },
    // 点击上传图片
    addImg () {
      // $('.img_content').css('height', $(window).height() - 90 + 'px')
      this.isImgShow = true
    },
    // 点击切换tabs
    clickTabs (index) {
    // else if (this.bianma === '') {
    //     Toast('请选择检查编码')
    //     return false
    //   }
      if (this.morz === '') {
        Toast('请选择检查类别')
        return false
      } else if (this.songjiantime === '') {
        Toast('请选择送检日期')
        return false
      } else if (this.xiangmu === '') {
        Toast('请输入检查项目')
        return false
      } else if (this.jigou === '') {
        Toast('请选择检查机构')
        return false
      } else if (this.keshi === '') {
        Toast('请选择送检科室')
        return false
      } else if (this.linchuangzhenduan === '') {
        Toast('请选择临床诊断')
        return false
      } else if (this.baogaorenyuan === '') {
        Toast('请输入报告人员')
        return false
      } else if (this.riqi === '') {
        Toast('请选择报告日期')
        return false
      } else if (this.money === '') {
        Toast('请输入检查金额')
        return false
      } else if (this.imgList.length <= 0) {
        Toast('请上传检查报告照片')
        return false
      }

      // else if (this.binglihaoma === '') {
      //   Toast('请输入病历号码')
      //   return false
      // }
      this.tabIndex = index
    },
    // 返回
    back () {
      this.$router.history.go(-1)
    },
    // 检查内容 新增接口
    insertCheck () {
      var img = []
      // var _this = this
      this.imgList.forEach(function (current, index, arr) {
        var obj = {
          picture: current
        }
        img.push(obj)
      })
      // jianchaleibie: this.jianchaleibie,
      this.$http.insertCheck({
        binglihaoma: this.binglihaoma,
        op_user_id: this.op_user_id,
        data_user_id: this.data_user_id,
        bianma: this.bianma,
        xiangmu: this.xiangmu,
        jigou: this.jigou,
        linchuangzhenduan: this.linchuangzhenduan,
        keshi: this.keshi,
        baogaorenyuan: this.baogaorenyuan,
        riqi: this.riqi,
        biaoxian: this.biaoxian,
        panduan: this.panduan,
        img: img,
        songjiantime: this.songjiantime,
        id: this.id,
        morz: this.morz,
        money: this.money,
        age: this.age
      })
        .then(res => {
          console.log(res)
          if (res.data.status === 'success') {
            if (sessionStorage.getItem('tuWenData') !== null) {
              var data = JSON.parse(sessionStorage.getItem('tuWenData'))
              var obj = {
                id: res.data.data.id,
                xiangmu: res.data.data.xiangmu,
                show: false,
                money: '',
                lishi: '0'
              }
              data.jianChaList.push(obj)
              sessionStorage.setItem('tuWenData', JSON.stringify(data))
            }
            this.$router.history.go(-1)
          }
        })
        .catch(err => {
          console.log(err)
        })
    },
    // 点击检验保存 / 检查保存
    keep () {
      // 检查保存
      this.insertCheck()
    },
    // 图片的保存内容
    keepImg () {
      // if (this.isSend === true) {
      //   // Toast('保存成功')
      //
      // } else {
      //   Toast('图片压缩中，请稍后')
      // }
      this.isImgShow = false
    }
  }
}
</script>

<style scoped>
  .all{
    width: 100%;
    height: 100%;
    overflow: auto;
    background: #FAF9FE;
  }
  .top{
    position: sticky;
    top: 0;
    z-index: 999;
  }
  header{
    width: 100vw;
    height: 44px;
    background: #FFFFFF;
    border-bottom: 1px solid  #E5E5E5;
    display: flex;
    align-items: center;
    overflow: hidden;
  }
  .div{
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: bold;
    display: flex;
    align-items: center;
  }
  .header_left, .header_right{
    width: 30%;
  }
  .header_cont{
    width: 40%;
  }
  .header_left img{
    width: 7px;
    height: 13px;
    margin: 0 5px 0 15px;
  }
  .header_cont {
    justify-content: center;
  }
  .header_right {
    justify-content: flex-end;
  }
   .header_right  button{
    margin-right: 15px;
  }
   .header_right  img{
    width: 15px;
    height: 15px;
    margin-right: 5px;
  }
  .solt{
    color: #1DA4F2;
  }
  .tabs{
    width: 100%;
    /*box-shadow: 0px 1px 0px 0px #E5E5E5;*/
    background: #1DA4F2;
    display: flex;
    align-items: center;
    font-weight: bold;
  }
  .tabs ul {
    width: 100%;
    margin: 0 auto;
    display: flex;
  }
  .tabs ul li{
    height: 60px;
    width: 100%;
    display: flex;
  }
  .tabs ul li img{
    width: 51%;
    height: 100%;
  }
  /*.select{*/
  /*  color: white !important;*/
  /*  background: #1DA4F2 !important;*/
  /*  border: 2px solid #1DA4F2 !important;*/
  /*}*/
  .content{
    width: 100%;
    flex: 1;
    overflow: scroll;
  }

  .tab1 ul{
    background: white;
  }
  .tab1 ul li{
    width: 92%;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /*padding: 0 10px;*/
    margin: 0 auto;
    box-sizing: border-box;
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: 500;
    border-bottom: 1px solid #E5E5E5;
  }
  .tab1 ul li:last-child{
    /*margin-bottom: 30px;*/
  }
  .tab1 ul li div{
    display: flex;
    align-items: center;
  }
  .tabInput{
    /*width: 120px;*/
    text-align: right;
    border: none;
  }
  .ageUnit{
    margin-left: 10px;
  }
  .tan{
    width: 13px;
    height: 7px;
    margin-left: 10px;
  }
  .tab2{
    background: white;
    padding: 0 0 10px 0;
    box-sizing: border-box;
  }
  .tab2 .title{
    width: 100%;
    height: 44px;
    display: flex;
    align-items: center;
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: bold;
    color: #333333;
  }
  .tab2 .title .hengGang{
    display: block;
    width: 2px;
    border-radius: 1px;
    height: 15px;
    background: #1DA4F2;
    margin: 0 8px 0 15px;
  }
  .yinXiang{
    width: 92%;
    height: 130px;
    margin: 10px auto;
  }
  .yinXiang textarea{
    width: 100%;
    height: 100%;
    background: #FAF9FE;
    resize: none;
    border: none;
    border-radius: 10px;
    padding: 10px;
    box-sizing: border-box;
    color: #999999;
    font-size: 13px;
    font-family: PingFang SC;
    font-weight: 500;
  }
  .tab3{
    background: white;
    padding: 10px 0;
    box-sizing: border-box;
  }
  .jianYanMingxi {
    width: 92%;
    margin: 0 auto;
  }
  .jianYanMingxi ul li{
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
    font-size: 11px;
    font-family: PingFang SC;
    font-weight: 500;
    color: #333333;
  }
  .jianYanMingxi_title button,
  .jianYanMingxi_input,
  .jianYanMingxi ul li button{
    background: #FAF9FE;
    width: 30%;
    border: none;
  }
  .jianYanMingxi_title button{
    height: 35px !important;
    border-radius: 10px;
  }
  .jianYanMingxi_input,
  .jianYanMingxi ul li button{
    height: 25px;
    border-radius: 14px !important;
  }
  .jianYanMingxi_input{
    text-align: center;
    padding: 0 10px;
    box-sizing: border-box;
  }
  .white{
    background: white !important;
    border: 1px solid #E5E5E5 !important;
  }
  .bottom{
    width: 100%;
    height: 60px;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    position: sticky;
    bottom: 0;
  }
  .bottom button{
    width: 92%;
    height: 44px;
    background: linear-gradient(90deg, #1DA3F2 0%, #1DC7F2 100%);
    border-radius: 22px;
    border: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    font-family: PingFang SC;
    font-weight: bold;
    color: #FFFFFF;
  }
  .bottom button img{
    width: 15px;
    height: 15px;
    margin-right: 7px;
  }
  .img_content{
    background: white;
    overflow: scroll;
  }
  .imgList{
    width: 92%;
    padding: 10px 0;
    box-sizing: border-box;
    margin: 0 auto;
  }

  /deep/ .van-picker__toolbar{
    font-size: 15px !important;
    font-weight: bold;
  }
  /deep/ .van-picker__cancel,
  /deep/ .van-picker__confirm{
    font-size: 15px !important;
    font-weight: bold;
  }
  /deep/ .van-picker__confirm{
    color: #1DA4F2;
  }
  .search{
    width: 100%;
    font-weight: bold;
  }
  /deep/ .van-search__action{
    font-size: 15px;
  }
  /deep/ .van-picker-column__item--selected{
    font-size: 19px !important;
    color: #1DA4F2;
  }
  .cityInput::placeholder{
    color: #1DA4F2;
  }
  /deep/ .van-uploader__input{
    border: 1px solid #E5E5E5;
  }
  .title{
    width: 100%;
    height: 44px;
    background: #FFFFFF;
    display: flex;
    align-items: center;
  }
  .duquBtn{
    width: 150px;
    height: 29px;
    background: #FFFFFF;
    border: 1px solid #1DA4F2;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    color: #1da4f2;
  }
  .duquBtn img{
    margin-right: 5px;
    width: 18px;
    height: 18px;
  }
</style>
